<template>
	<view style="border-bottom: 5px solid red;height: 100px;display: flex;justify-content: center;align-items: center;">
	<view class="userInfo" @click="chooseAddress" v-if="getUsername">
		<view style="display: flex;justify-content: space-between;">
			<text>收货人：{{getUsername}}</text>
			<view style="display: flex;align-items: center;">
				<text>
					电话：{{getPhone}}
				</text>
				<uni-icons type="right" size="20"></uni-icons>
			</view>
		</view>
		<view>
			<text>收货地址：{{getAddress}}</text>
		</view>
	</view>
	<view @click="chooseAddress" v-if="!getUsername">
		<text class="nulladdress">请选择收货地址</text>
	</view>
	</view>
</template>

<script>
	import {mapState,mapMutations,mapGetters}  from 'vuex'
	export default {
		name: "my_adress",
		data() {
			return {
				userAddress:[]
			};
		},
		methods:{
		...mapMutations("m_user",["updateAddress"]),
		async chooseAddress(){
			const [err,suc]=await uni.chooseAddress()
			if(suc && suc.errMsg==="chooseAddress:ok"){
				this.updateAddress(suc)
			}else{
				uni.$showMsg('地址设置失败')
			}
		}	
		},
		computed:{
			...mapGetters("m_user",["getAddress","getUsername","getPhone"])
		}
	}
</script>

<style scoped>
	.userInfo {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100rpx;
		 width: 100%;
		padding: 20px;
		font-size: 14px;
	}
	.nulladdress{
		background-color: #1aad19;
		padding: 10px 20px;
		border-radius: 5px;
		color: aliceblue;
	}
</style>
